$(document).ready(function () {
    $('.scroll-box').myScroll({
        speed: 60, //数值越大，速度越慢
        rowHeight: 81//li的高度
    });
    <!-- 数字 -->
    $('.numberStyle').leoTextAnimate({
        delay:1000, //延时出现时间
        autorun: true, //是否自动运行
        fixed: [',', ':', '.'], //
        start: '0'
    });
    laydate.render({
        elem: '#period', //指定元素
        range: true,
        theme: '#37B866',
        min:-30,
        max: 0
    });

    // 网络评价好中差评占比
    function myChart1() {
        var myChart = echarts.init(document.getElementById('pinglun-1'));
        let data = [
            { value: 50, name: '好评' },
            { value: 30, name: '中评' },
            { value: 20, name: '差评' }
        ]
        var color =  ['#9A4CFB', '#4B66C7', '#44D798']

        var seriesData = data.map((item, index) => {
            return {
                name: item.name,
                value: item.value,
            }
        })
        var option = {
            title: {
                text: '景区',
                textStyle: {
                    fontSize: 12,
                    color: "#fff"
                },
                x: "center"
            },
            series: [
                {
                    name: '渠道分析',
                    type: 'pie',
                    radius: '60%',
                    center: ['50%', '50%'],
                    data: seriesData,
                    color: color,
                    labelLine: {
                        normal: {
                            length: 20,
                            length2: 30,
                            lineStyle: {
                                type: 'solid'
                            }
                        }

                    },
                    label: {
                        normal: {
                            formatter: function (params) {
                                if (params.dataIndex === 0) {
                                    return '{color1|' + params.value + '%}' + '\n{black|' + params.name + '}'
                                } else if (params.dataIndex === 1) {
                                    return '{color2|' + params.value + '%}' + '\n{black|' + params.name + '}'
                                } else if (params.dataIndex === 2) {
                                    return '{color3|' + params.value + '%}' + '\n{black|' + params.name + '}'
                                }
                            },
                            rich: {
                                black: {
                                    color: '#666',
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontSize: '14px',
                                    fontFamily: 'PingFangSC'
                                },
                                color1: {
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontWeight: 700,
                                    fontFamily: 'PingFangSC',
                                    color: '#9A4CFB'
                                },
                                color2: {
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontWeight: 700,
                                    fontFamily: 'PingFangSC',
                                    color: '#4B66C7'
                                },
                                color3: {
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontWeight: 700,
                                    fontFamily: 'PingFangSC',
                                    color: '#44D798'
                                }
                            }
                        }
                    },
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        }

        myChart.setOption(option);
    }
    function myChart2() {
        var myChart = echarts.init(document.getElementById('pinglun-2'));
        let data = [
            { value: 50, name: '好评' },
            { value: 30, name: '中评' },
            { value: 20, name: '差评' }
        ]
        var color =  ['#9A4CFB', '#4B66C7', '#44D798']

        var seriesData = data.map((item, index) => {
            return {
                name: item.name,
                value: item.value,
            }
        })
        var option = {
            title: {
                text: '酒店',
                textStyle: {
                    fontSize: 12,
                    color: "#fff"
                },
                x: "center"
            },
            series: [
                {
                    name: '渠道分析',
                    type: 'pie',
                    radius: '60%',
                    center: ['50%', '50%'],
                    data: seriesData,
                    color: color,
                    labelLine: {
                        normal: {
                            length: 20,
                            length2: 30,
                            lineStyle: {
                                type: 'solid'
                            }
                        }

                    },
                    label: {
                        normal: {
                            formatter: function (params) {
                                if (params.dataIndex === 0) {
                                    return '{color1|' + params.value + '%}' + '\n{black|' + params.name + '}'
                                } else if (params.dataIndex === 1) {
                                    return '{color2|' + params.value + '%}' + '\n{black|' + params.name + '}'
                                } else if (params.dataIndex === 2) {
                                    return '{color3|' + params.value + '%}' + '\n{black|' + params.name + '}'
                                }
                            },
                            rich: {
                                black: {
                                    color: '#666',
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontSize: '14px',
                                    fontFamily: 'PingFangSC'
                                },
                                color1: {
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontWeight: 700,
                                    fontFamily: 'PingFangSC',
                                    color: '#9A4CFB'
                                },
                                color2: {
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontWeight: 700,
                                    fontFamily: 'PingFangSC',
                                    color: '#4B66C7'
                                },
                                color3: {
                                    padding: [5, -28],
                                    textAlign: 'left',
                                    fontWeight: 700,
                                    fontFamily: 'PingFangSC',
                                    color: '#44D798'
                                }
                            }
                        }
                    },
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        }

        myChart.setOption(option);
    }

    // 景区评价排行
    function myChart3() {
        var myChart = echarts.init(document.getElementById('pinglun-3'));
        var visits = [5834,6872,7812,8853,9876]; //数值
        var grade = ['石头部落','白云小镇','木扎岭','天池山','白云山'];
        var data = {
            grade: grade,
            // totalCost: totalCost,
            visits: visits,
        };
        option = {
            grid: {
                top:'8%',
                left:'-10%',
                right: '5%',
                bottom: '-5%',
                containLabel: true

            },
            tooltip: {
                show: false
            },
            xAxis: {
                show: false
            },
            yAxis: [{
                type: 'category',

                axisTick: {
                    show: false
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    margin:70,
                    textStyle: {
                        align:'left',
                        fontSize: 12,
                        color: '#fff'
                    },
                },
                data: data.grade
            }, {
                show:false,
                type: 'category',

                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#fff',
                    },
                },
                splitArea: {
                    show: false
                },
                splitLine: {
                    show: false
                },
                data: data.visits
            }, ],
            series: [
                {

                    type: 'bar',

                    itemStyle: {
                        normal: {
                            show: true,
                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                offset: 0,
                                color: 'rgba(55,184,102,0.3)'

                            }, {
                                offset: 1,
                                color: 'rgba(55,184,102,1)'

                            }]),
                            barBorderRadius: 0,
                            borderWidth: 0,
                            borderColor: '#333',
                        }
                    },
                    label: {
                        normal: {
                            position: 'right',
                            color:'#fff',
                            show:true,
                            formatter:function(params){
                                return params.value
                            }
                        }
                    },
                    barWidth: '30%',

                    data: data.visits
                }

            ]
        };

        myChart.setOption(option);
    }
    function myChart4() {
        var myChart = echarts.init(document.getElementById('pinglun-4'));
        var visits = [5834,6872,7812,8853,9876]; //数值
        var grade = ['龙池曼','万氏故居','两程故里','手绘小镇','陆浑水库'];
        var data = {
            grade: grade,
            // totalCost: totalCost,
            visits: visits,
        };
        option = {
            grid: {
                top:'8%',
                left:'-10%',
                right: '5%',
                bottom: '-5%',
                containLabel: true

            },
            tooltip: {
                show: false
            },
            xAxis: {
                show: false
            },
            yAxis: [{
                type: 'category',

                axisTick: {
                    show: false
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    margin:70,
                    textStyle: {
                        align:'left',
                        fontSize: 12,
                        color: '#fff'
                    },
                },
                data: data.grade
            }, {
                show:false,
                type: 'category',

                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#fff',
                    },
                },
                splitArea: {
                    show: false
                },
                splitLine: {
                    show: false
                },
                data: data.visits
            }, ],
            series: [
                {

                    type: 'bar',

                    itemStyle: {
                        normal: {
                            show: true,
                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                offset: 0,
                                color: 'rgba(231,109,89,0.3)'

                            }, {
                                offset: 1,
                                color: 'rgba(231,109,89,1)'

                            }]),
                            barBorderRadius: 0,
                            borderWidth: 0,
                            borderColor: '#333',
                        }
                    },
                    label: {
                        normal: {
                            position: 'right',
                            color:'#fff',
                            show:true,
                            formatter:function(params){
                                return params.value
                            }
                        }
                    },
                    barWidth: '30%',

                    data: data.visits
                }

            ]
        };

        myChart.setOption(option);
    }
    function myChart5() {
        var myChart = echarts.init(document.getElementById('pinglun-5'));
        var visits = [5834,6872,7812,8853,9876]; //数值
        var grade = ['嵩县泊雅中州酒店','嵩县迪尼斯酒店','嵩县豫杭文化假日酒店','白云山柴锅飘香宾馆','天池山天润居'];
        var data = {
            grade: grade,
            // totalCost: totalCost,
            visits: visits,
        };
        option = {
            grid: {
                top:'8%',
                left:'-23%',
                right: '5%',
                bottom: '-5%',
                containLabel: true

            },
            tooltip: {
                show: false
            },
            xAxis: {
                show: false
            },
            yAxis: [{
                type: 'category',

                axisTick: {
                    show: false
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    margin:130,
                    textStyle: {
                        align:'left',
                        fontSize: 12,
                        color: '#fff'
                    },
                },
                data: data.grade
            }, {
                show:false,
                type: 'category',

                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#fff',
                    },
                },
                splitArea: {
                    show: false
                },
                splitLine: {
                    show: false
                },
                data: data.visits
            }, ],
            series: [
                {

                    type: 'bar',

                    itemStyle: {
                        normal: {
                            show: true,
                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                offset: 0,
                                color: 'rgba(55,184,102,0.3)'

                            }, {
                                offset: 1,
                                color: 'rgba(55,184,102,1)'

                            }]),
                            barBorderRadius: 0,
                            borderWidth: 0,
                            borderColor: '#333',
                        }
                    },
                    label: {
                        normal: {
                            position: 'right',
                            color:'#fff',
                            show:true,
                            formatter:function(params){
                                return params.value
                            }
                        }
                    },
                    barWidth: '30%',

                    data: data.visits
                }

            ]
        };

        myChart.setOption(option);
    }
    function myChart6() {
        var myChart = echarts.init(document.getElementById('pinglun-6'));
        var visits = [5834,6872,7812,8853,9876]; //数值
        var grade = ['白云山快乐农家','嵩县洛阳新升宾馆','嵩县家乐旅馆','嵩县迎春宾馆','嵩县金鼎宾馆'];
        var data = {
            grade: grade,
            // totalCost: totalCost,
            visits: visits,
        };
        option = {
            grid: {
                top:'8%',
                left:'-16%',
                right: '5%',
                bottom: '-5%',
                containLabel: true

            },
            tooltip: {
                show: false
            },
            xAxis: {
                show: false
            },
            yAxis: [{
                type: 'category',

                axisTick: {
                    show: false
                },
                axisLine: {
                    show: false,
                },
                axisLabel: {
                    margin:100,
                    textStyle: {
                        align:'left',
                        fontSize: 12,
                        color: '#fff'
                    },
                },
                data: data.grade
            }, {
                show:false,
                type: 'category',

                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    textStyle: {
                        fontSize: 12,
                        color: '#fff',
                    },
                },
                splitArea: {
                    show: false
                },
                splitLine: {
                    show: false
                },
                data: data.visits
            }, ],
            series: [
                {

                    type: 'bar',

                    itemStyle: {
                        normal: {
                            show: true,
                            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                                offset: 0,
                                color: 'rgba(231,109,89,0.3)'

                            }, {
                                offset: 1,
                                color: 'rgba(231,109,89,1)'

                            }]),
                            barBorderRadius: 0,
                            borderWidth: 0,
                            borderColor: '#333',
                        }
                    },
                    label: {
                        normal: {
                            position: 'right',
                            color:'#fff',
                            show:true,
                            formatter:function(params){
                                return params.value
                            }
                        }
                    },
                    barWidth: '30%',

                    data: data.visits
                }

            ]
        };

        myChart.setOption(option);
    }
    setTimeout( myChart1,1000);
    setTimeout( myChart2,2000);
    setTimeout(myChart3,3000);
    setTimeout(myChart4,4000);
    setTimeout(myChart5,5000);
    setTimeout(myChart6,6000);
})
